<template>
	<view class="cu-modal" :class="isShow?'show':''">
		<view class="cu-dialog my-prize-dialog cash">
			<view class="title">
				我的余额：{{balance}}元
			</view>
			<view class="itembox">
				<view class="item" v-for="(items,i) in myPrizelist" :key="i">
					<text class="left">{{items.send_money}} {{items.send_type === 2 ? '优惠券' : '现金红包'}}</text>
					<text class="right">{{totime(items.visit_time * 1000)}}</text>
				</view>
			</view>
			<view class="no-prize" v-if="myPrizelist.length==0 && isShow">
				您还未有分享
			</view>
			<view class="bottom">
				<view class="cancel" @tap="hide">
					关闭
				</view>
				<view class="comfirm" @tap="widthDraw">
					提现
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	import { totime } from '../utils/index.js'
	export default {
		data() {
			return {
				isShow: false,
				balance: 0,
				userinfo: {},
				myPrizelist: []
			}
		},
		methods: {
			totime,
			visitList(openid) {
				this.$comm.http('/api/activelove/visit_list', {
					openid
				}).then(res => {
					if(res.code === 404){
						this.$emit('onLogin')
						return
					}
					this.myPrizelist = res.data.list
					this.userinfo = res.data.user_info
					this.balance = res.data.user_info.balance
				})
			},
			open(openid) {
				this.isShow = true
				this.visitList(openid)
			},
			hide() {
				this.isShow = false
			},
			// 微信提现
			wxWidthDraw(option){
				const config = JSON.parse(uni.getStorageSync("config"))
				jWeixin.config({
				  appId: config.appId, // 必填，公众号的唯一标识
				  timestamp: config.timestamp, // 必填，生成签名的时间戳
				  nonceStr: config.nonceStr, // 必填，生成签名的随机串
				  signature: config.signature,// 必填，签名
			      jsApiList: ['requestMerchantTransfer'] // 必填，需要使用的JS接口列表
				});
				jWeixin.ready(()=> {
				  jWeixin.checkJsApi({
				    jsApiList: ['requestMerchantTransfer'],
				    success: (res)=> {
				      if (res.checkResult['requestMerchantTransfer']) {
				        WeixinJSBridge.invoke('requestMerchantTransfer', {
				            mchId: 1678852614,
				            appId: config.appId,
				            package: option.width_draw_info.package_info,
				          },
				          (res)=> {
				            if (res.err_msg === 'requestMerchantTransfer:ok') {
				              // res.err_msg将在页面展示成功后返回应用时返回success，并不代表付款成功
							  // 清空余额
							  this.balance = 0
							  this.userinfo.balance = this.balance
							  uni.setStorageSync('userinfo', JSON.stringify(this.userinfo))
							  // 提示提现成功
							  uni.showToast({
							  	icon:"none",
							  	title: '提现成功',
							  	mask: true,
							  	duration: 2000
							  });
				            }
				          }
				        );
				      } else {
				        alert('你的微信版本过低，请更新至最新版本。');
				      }
				    }
				  });
				});
			},
			// 提现
			widthDraw(){
				uni.showLoading({title: '加载中', mask: true})
				if(this.balance === 0){
					return uni.showToast({
						icon:"none",
						title: '您未有金额可提取！',
						mask: true,
						duration:1500
					});
				}
				
				const openid = uni.getStorageSync("openid")
				this.$comm.http('/api/activelove/width_draw', {
					openid,
					money: this.balance
					// money: '0.1'
				}).then(res => {
					uni.hideLoading()
					if(res.code === 404){
						this.$emit('onLogin')
						return
					}
					if(res.code === -1){
						return uni.showToast({
							icon:"none",
							title: res.msg,
							mask: true,
							duration: 2000
						});
					}
					const info = res.data
					info.width_draw_info = JSON.parse(res.data.width_draw_info)
					this.wxWidthDraw(info)
				})
			}
		}
	}
</script>

<style lang="scss">
	.cash {
		width: 600upx;
		min-height: 180upx;
		background: #FFEEDF;
		border: 10upx solid #F2692F;
		color: #333;
		font-size: 24upx;
		font-family: PingFang-SC-Medium;
		border-radius: 40upx;
		// padding-bottom: 20upx;
	}
	.my-prize-dialog .title {
		font-family: PingFang-SC-Bold;
		font-size: 16px;
		color: #E4431A;
		letter-spacing: 0.57px;
		display: flex;
		padding: 36upx 0;
		justify-content: center;
	}
	.my-prize-dialog .itembox {
		max-height: 1320upx;
		overflow-y: auto;
	}
	.my-prize-dialog .item {
		width: 100%;
		height: 66upx;
		padding: 0 32upx;
		box-sizing: border-box;
		display: flex;
		align-items: center;
		justify-content: space-between;
	}
	.my-prize-dialog .no-prize {
		padding: 40upx 0;
	}
	.bottom{
		background-color: #fff;
		display: flex;
		padding: 10rpx;
		color: #fff;
		font-size: 30rpx;
		justify-content: space-around;
		.cancel{
			background: linear-gradient(0deg, #a1c4fd, #c2e9fb);
			padding: 15rpx 30rpx;
			border-radius: 15rpx;
		}
		.comfirm{
			background: linear-gradient(0deg, #4facfe, #00f2fe);
			padding: 15rpx 30rpx;
			border-radius: 15rpx;
		}
	}
</style>